<template>
  <el-table :data="hospitallist" style="width: 100%">
    <el-table-column prop="name" label="姓名" />
    <el-table-column prop="description" label="简介" />
    <el-table-column prop="address" label="医院地址" />
    <el-table-column label="医院图片">
      <template #default="scope">
        <img :src="scope.row.image">
      </template>
    </el-table-column>
    <el-table-column label="查看">
      <template #default="scope">
        <el-button type="primary" @click="router.push({path: '/hospital_detail', query: {id: scope.row.id}})">查看</el-button>
      </template>
    </el-table-column>
  </el-table>
</template>

<script setup>
  import { ref, onMounted } from "vue"
  import axios from "axios"
  import { useRoute, useRouter } from "vue-router";

  const route = useRoute()
  const router = useRouter()

  let hospitallist = ref([])

  const gethospitallist=()=>{
    axios.get(`http://127.0.0.1:8000/doctor/hospitalList/`)
    .then(res=>{
      console.log(res)
      hospitallist.value = res.data
    })
    .catch(error=>{
      console.log(error)
    })
  }

  onMounted(()=>{
    gethospitallist()
  })

</script>
